<template>
<view>

<!--<import src="../../templates/common-list.wxml"></import>-->
<!--<import src="../../templates/copyright.wxml"></import>-->
<!--<import src="../../templates/loading.wxml"></import>-->

<view class="topic-common-list" :style="'display:' + isCategoryPage">
  
</view>


<view class="topic-common-list" :style="'display:' + isSearchPage">
  <view class="topic-list-item">
    <image src="/static/images/website-search.png" class="cover" mode="aspectFill"></image>
    <view class="topic-content-brief">
      <view class="topic-content-title">
        <text>搜索关键字：</text>
        <text class="searchKey">{{searchKey}}</text>
      </view>
      <text class="search-tips">* 本搜索是全文搜索</text>
    </view>
  </view>
</view>

<view class="container">
  <view class="showerror" :style="'display:' + showerror">
    <!--image src="/static/images/cry80.png" style="height:100rpx;width:100rpx"></image-->
    <view class="errortext">
      暂时无法访问网络
      <view class>
        <button class="more-button" @tap="reload" size="mini">重新加载</button>
      </view>
    </view>
  </view>

  <view :style="'display:' + showallDisplay">
    <block data-type="template" data-is="tempCommonList" data-attr="postsList">

  <view class="post-list">
    <block v-for="(item, index) in postsList" :key="index">
    <view class="list-item-ad" :index="index" v-if="index%item.listAdEvery ==0  && index!=0 && item.listAd =='1' && item.listAdId !=''  && listAdsuccess">
        <block v-if="(index/item.listAdEvery)%2==0">
					<ad :unit-id="item.videoAdId" ad-type="video" ad-theme="white" @error="adbinderror"></ad>
				</block>
        <block v-else>
        <ad :unit-id="item.listAdId" ad-intervals="30" @error="adbinderror"></ad>
        </block>
      </view>
      <view class="post-item" :index="index" :id="item.id" @tap="redictDetail">
        <image :src="item.thumb" mode="aspectFill" class="post-img"></image>
        <view class="post-desc">
          <view class="post-title">
            <text>{{item.title}}</text>
          </view>
          <view class="post-data">
            <image src="/static/images/calendar.png"></image>
            <text>{{item.updatetime}}</text>
          
            <image src="/static/images/pageviews.png"></image>
            <text class>{{item.hits}}</text>
          </view>
        </view>
      </view>
    </block>
  </view>
</block>
    <view :style="'display:' + (isLoading?'block':'none')">
        <template is="tempLoading"></template>
      </view>

    <view class="loadingmore" :style="'display:' + floatDisplay">
      <view class="no-more" :hidden="!isLastPage">- 无更多文章 -</view>
    </view>

  </view>

  <view class="copyright" :style="'display:' + floatDisplay">
   <block data-type="template" data-is="tempCopyright" data-attr="webSiteName:webSiteName,domain:domain">
<view>  {{webSiteName}} </view>
</block>
  </view>
</view>
</view>
</template>

<script>

var Api = require("../../utils/api.js");
var util = require("../../utils/util.js");

var wxApi = require("../../utils/wxApi.js");
var wxRequest = require("../../utils/wxRequest.js");
import config from "../../utils/config";
var pageCount = config.getPageCount;
var webSiteName = config.getWebsiteName;
var domain = config.getDomain;

export default {
  data() {
    return {
      title: '文章列表',
      postsList: {},
      pagesList: {},
      categoriesList: {},
      postsShowSwiperList: {},
      isLastPage: false,
      page: 1,
      search: '',
      categories: 0,
      categoriesName: '',
      categoriesImage: "",
      showerror: "none",
      isCategoryPage: "none",
      isSearchPage: "none",
      showallDisplay: "block",
      displaySwiper: "block",
      floatDisplay: "none",
      searchKey: "",
      webSiteName: webSiteName,
      domain: domain,
      isLoading: false
    };
  },

  components: {},
  props: {},
  onShareAppMessage: function () {
    var title = "分享“" + webSiteName + "”";
    var path = "";

    if (this.categories && this.categories != 0) {
      title += "的专题：" + this.categoriesList.name;
      path = 'pages/list/list?categoryID=' + this.categoriesList.id;
    } else {
      title += "的搜索内容：" + this.searchKey;
      path = 'pages/list/list?search=' + this.searchKey;
    }

    return {
      title: title,
      path: path,
      success: function (res) {// 转发成功
      },
      fail: function (res) {// 转发失败
      }
    };
  },
  onReachBottom: function () {
    var self = this;

    if (!self.isLastPage) {
      self.setData({
        page: self.page + 1
      });
      console.log('当前页' + self.page);
      this.fetchPostsData(self);
    } else {
      console.log('最后一页');
    }
  },
  onLoad: function (options) {
    var self = this; // 设置插屏广告

    if (options.categoryID && options.categoryID != 0) {
      self.setData({
        categories: options.categoryID,
        isCategoryPage: "block"
      });
      self.fetchCategoriesData(options.categoryID);
    }

    if (options.search && options.search != '') {
      uni.setNavigationBarTitle({
        title: "搜索"
      });
      self.setData({
        search: options.search,
        isSearchPage: "block",
        searchKey: options.search
      });
      this.fetchPostsData(self);
    }
  },
  methods: {
    formSubmit: function (e) {
      var url = '../list/list';

      if (e.detail.value.input != '') {
        url = url + '?search=' + e.detail.value.input;
      }

      uni.navigateTo({
        url: url
      });
    },
    reload: function (e) {
      var self = this;

      if (self.categories && self.categories != 0) {
        self.setData({
          isCategoryPage: "block",
          showallDisplay: "none",
          showerror: "none"
        });
        self.fetchCategoriesData(self.categories);
      }

      if (self.search && self.search != '') {
        self.setData({
          isSearchPage: "block",
          showallDisplay: "none",
          showerror: "none",
          searchKey: self.search
        });
      }

      self.fetchPostsData(self);
    },
    //加载分页
    loadMore: function (e) {
      var self = this;

      if (!self.isLastPage) {
        self.setData({
          page: self.page + 1
        });
        console.log('当前页' + self.page);
        this.fetchPostsData(self);
      } else {
        uni.showToast({
          title: '没有更多内容',
          mask: false,
          duration: 1000
        });
      }
    },
    //获取文章列表数据
    fetchPostsData: function (data) {
      var self = this;
      if (!data) data = {};
      if (!data.page) data.page = 1;
      if (!data.categories) data.categories = 0;
      if (!data.search) data.search = '';

      if (data.page === 1) {
        self.setData({
          postsList: []
        });
      }

      ;
      self.setData({
        isLoading: true
      });
      var getPostsRequest = wxRequest.getRequest(Api.getListUrl(data));
      getPostsRequest.then(response => {
		  
        if (response.statusCode === 200) {
          if (response.data.data.length < pageCount) {
            self.setData({
              isLastPage: true,
              isLoading: false
            });
          };
		  
		  
		  console.log(response.data.data);
          self.setData({
            floatDisplay: "block",
            showallDisplay: "block",
            postsList: self.postsList.concat(response.data.data.map(function (item) {
             
             
				item.post_thumbnail_image = item.thumb;
              if (item.post_thumbnail_image == null || item.post_thumbnail_image == '') {
                item.post_thumbnail_image = "/static/images/logo700.png";
              }

              item.date = item.updatetime;
              return item;
            }))
          });
        } else {
          if (response.data.code == "rest_post_invalid_page_number") {
            self.setData({
              isLastPage: true,
              isLoading: false
            });
          } else {
            uni.showToast({
              title: response.data.message,
              duration: 1500
            });
          }
        }
      }).catch(function () {
        if (data.page == 1) {
          self.setData({
            showerror: "block",
            floatDisplay: "none"
          });
        } else {
          uni.showModal({
            title: '加载失败',
            content: '加载数据失败,请重试.',
            showCancel: false
          });
          self.setData({
            page: data.page - 1
          });
        }
      }).finally(function () {
        uni.hideLoading();
        self.setData({
          isLoading: false
        });
      });
    },
    // 跳转至查看文章详情
    redictDetail: function (e) {
      // console.log('查看文章');
      var id = e.currentTarget.id,
          url = '../detail/detail?id=' + id;
      uni.navigateTo({
        url: url
      });
    },
    //获取分类列表
    fetchCategoriesData: function (id) {
      var self = this;
      self.setData({
        categoriesList: []
      });
     

     self.fetchPostsData(self);
    }
  }
};
</script>
<style>
@import "./list.css";
</style>